import { ref } from 'vue'
import { useIntersectionObserver } from '@vueuse/core'

export default function useObserver(loadData) {
  const refRoot = ref()
  const { stop } = useIntersectionObserver(
    refRoot,
    ([{ isIntersecting }], observerElement) => {
      if (isIntersecting) {
        loadData()
        stop()
      }
    },
    {
      threshold: 0
    }
  )
  return {
    refRoot
  }
}